<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Configurar apresentação de objetos</title>


<!-- Jquery -->
<link rel="stylesheet" type="text/css" media="screen" href="js/jquery-ui-1.7.2.custom/css/smoothness/jquery-ui-1.7.2.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="js/jquery.jqGrid-3.5.2/css/ui.jqgrid.css" />
<link rel="stylesheet" type="text/css" media="screen" href="js/jquery-treeview/jquery.treeview.css" />

<!-- Css Buttons -->
<link href="css/cssbuttons/cssbuttons.css" rel="stylesheet" type="text/css">
<link href="css/cssbuttons/skins/glass/glass.css" rel="stylesheet" type="text/css">
<link href="css/cssbuttons/skins/sample/sample.css" rel="stylesheet" type="text/css">

<!-- GeCo -->
<link rel="stylesheet" type="text/css" media="screen" href="css/geco.css" rel="stylesheet">

<script src="js/jquery.jqGrid-3.5.2/js/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="js/jquery-ui-1.7.2.custom/js/jquery-ui-1.7.2.custom.min.js" type="text/javascript"></script>
<script src="js/jquery.jqGrid-3.5.2/js/i18n/grid.locale-en.js" type="text/javascript"></script>
<script src="js/jquery.jqGrid-3.5.2/js/jquery.jqGrid.min.js" type="text/javascript"></script>
<script src="js/jquery.jqGrid-3.5.2/src/grid.custom.js" type="text/javascript"></script>
<script src="js/jquery-treeview/jquery.treeview.min.js" type="text/javascript"></script>
<script src="js/Utils.js" type="text/javascript"></script>
<script src="combinacao.js" type="text/javascript"></script>

<style type="text/css">

	body {font-size:80%}

</style>

</head>
<body>

	<table style="width: 100%;">
		
		<tr>
			<td colspan="2">
			<h3>Cadastro de Combinação</h3>
			</td>
		</tr>
		
		<tr>
			<td style="width: 30%; ">
				<ul id="modelTree"></ul>
				<div id="attributeDiv"></div>
			</td>
			<td style="width: 70%;">
				<div id="accordion">
				    
				    <h3><a href="#">Combinação</a></h3>
				    <div>
				    	<form id="combinacaoForm">
					    	<p>
						    	<span style="width: 90; text-align: right;"><label>Modelo:</label></span> 
						    	<input type="text" readonly="readonly" name="modelo.id"/>
						    	<input type="text" readonly="readonly" name="modelo.descricao"/>
						    </p>
					    	<p>
					    		<span style="width: 90; text-align: right;"><label>Código:</label></span>
					    		<input type="text" readonly="readonly" name="id"/>
					    	</p>
					    	<p>
					    		<span style="width: 90; text-align: right;"><label>Descrição:</label></span>
					    		<input type="text" name="descricao"/>
					    	</p>
					    	<p>
					    		<input type="button" id="buttonSalvarCombinacao" value="Salvar"/>
					    	</p>
				    	</form>
				    </div>
				    
				    <h3><a href="#" id="headerTemplate">Template</a></h3>
				    <div>
				    	<form id="templateForm">
				    		
				    		<input type="hidden" name="id"></input>
				    		<input type="hidden" name="chaveObjetoModelo"></input>
				    		<input type="hidden" name="combinacao.id"></input>
				    		
					    	<div id="tabs">
								<ul>
									<li><a href="#tabs-1">Fonte</a></li>
									<li><a href="#tabs-2">Detalhes</a></li>
								</ul>
								<div id="tabs-1">
									<p><textarea style="width: 100%" name="template.fonte"></textarea></p>
								</div>
								<div id="tabs-2">
									<p>
								    	<span style="width: 90; text-align: right;"><label>Código:</label></span> 
								    	<input type="text" readonly="readonly" name="template.id"/>
								    </p>
									<p>
								    	<span style="width: 90; text-align: right;"><label>Ordem:</label></span> 
								    	<input type="text" name="ordem"/>
								    </p>
									<p>
								    	<span style="width: 90; text-align: right;"><label>Descrição:</label></span> 
								    	<input type="text" name="template.descricao"/>
								    </p>
							    	<p>
								    	<span style="width: 90; text-align: right;"><label>Sigla:</label></span> 
								    	<input type="text" name="template.sigla"/>
								    </p>
								</div>
							</div>
						</form>
						
						<br/>
						
						<div style="text-align: right;">
							<input type="button" id="buttonBuscarCombinacaoTemplate" value="Buscar Template"/>
							<input type="button" id="buttonSalvarCombinacaoTemplate" value="Salvar Template"/>
						</div>
						
					</div>
					
					<h3 id="assoc"><a href="#">Associações</a></h3>
				    <div>
				    	<table id="gridAssociacoes"></table>
				    </div>
				    
				    <h3><a href="#">Geração de Código</a></h3>
				    <div>
				    	<p id="codePanel">
				    	</p>
				    	<div style="text-align: right;">
							<input type="button" id="buttonGerarCodigo" value="Gerar Código"/>
						</div>
				    </div>
				    
				    <input maxlength="">
				    
				</div>
			</td>
		</tr>
	</table>
	


</body>
</html>